<script lang="ts" setup name="stockPlanList">
import ProTable from "@/components/ProTable/index.vue";
import { Inventory } from "@/api/interface";
import { ProTableInstance, ColumnProps } from "@/components/ProTable/interface";
import { useRouter, useRoute } from "vue-router";
import { getStockPlanList, deleteStockPlan, checkStockPlan } from "@/api/modules/inventory";
import { stockSPlanStatus } from "@/utils/serviceDict";
import { ref, onBeforeUpdate } from "vue";
import { ElMessageBox, ElMessage } from "element-plus";
import { CirclePlus } from "@element-plus/icons-vue";
import { useHandleData } from "@/hooks/useHandleData";
import { formatDate } from "@/utils/date-formatter";
import { getLastQuarterDays } from "@/utils/date";

const router = useRouter();
const route = useRoute();

const proTable = ref<ProTableInstance>();
const initParam = ref({ orderType: 1 });
const column: ColumnProps<Inventory.ResStockPlanList>[] = [
  {
    type: "index",
    label: "序号",
    width: 60,
    search: {
      el: "date-picker",
      label: "单据日期",
      key: "date",
      defaultValue: [formatDate(-getLastQuarterDays(), "start", "yyyy-MM-dd"), formatDate(0, "end", "yyyy-MM-dd")],
      order: 1,
      props: {
        type: "datetimerange",
        format: "YYYY-MM-DD",
        valueFormat: "YYYY-MM-DD"
      }
    }
  },
  {
    sortable: true,
    prop: "orderNo",
    label: "单据号",
    // search 配置是否可以通过上面搜索框搜索到数据
    search: {
      el: "input"
    }
  },
  // {
  //       sortable: true,prop: "planType",
  //   enum: stockSPlanScope,
  //   label: "盘点范围"
  // },
  {
    sortable: true,
    prop: "status",
    enum: stockSPlanStatus,
    label: "盘点状态",
    search: {
      el: "select"
    }
  },
  {
    sortable: true,
    prop: "createTime",
    label: "创建日期"
  },
  {
    sortable: true,
    prop: "houseName",
    label: "仓库"
  },
  {
    sortable: true,
    prop: "sysUserName",
    label: "创建人"
  },
  {
    sortable: true,
    prop: "checkerName",
    label: "审核人"
  },
  {
    sortable: true,
    prop: "checkTime",
    label: "完成时间"
  },
  {
    sortable: true,
    prop: "remark",
    label: "备注"
  },
  {
    prop: "operation",
    label: "操作"
  }
];

const toCreate = (id: number) => {
  // 跳转详情页面
  if (id !== 0) {
    router.push({
      path: "/stock/stockPlanEdit",
      query: {
        id: id
      }
    });
  } else {
    router.push(`/stock/stockPlanEdit`);
  }
};
// 审核盘点计划
const toCheck = async (row: any) => {
  await useHandleData(checkStockPlan, { id: row.orderId }, `完成【${row.orderNo}】盘点计划`);
  proTable.value?.getTableList();
};

// 删除计划（盘点中不能删除）
const toDelete = async (id: number) => {
  await ElMessageBox.confirm("确认删除此条计划吗", "温馨提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning"
  });
  await deleteStockPlan({ id: id });
  proTable.value?.getTableList();
  ElMessage.success("数据删除成功");
};

// 判断数据更新发请求
onBeforeUpdate(() => {
  if (route.query.upList) {
    proTable.value?.getTableList();
  }
});
</script>

<template>
  <div class="table-box">
    <ProTable
      :columns="column"
      ref="proTable"
      title="盘点计划列表"
      :pagination="true"
      row-key="id"
      :indent="20"
      :request-api="getStockPlanList"
      :init-param="initParam"
      highlight-current-row
    >
      <template #tableHeader>
        <!-- <el-button v-auth="'add'" type="primary" :icon="CirclePlus" @click="toCreate(0)"> 新增 </el-button>  -->
        <el-button v-auth="'add'" type="primary" :icon="CirclePlus" @click="toCreate(0)"> 新增盘点计划 </el-button>
      </template>
      <template #operation="scope">
        <el-button v-auth="'check'" v-if="scope.row.status === 2" type="primary" link @click="toCheck(scope.row)">
          完成盘点
        </el-button>
        <el-button v-auth="'edit'" v-if="scope.row.status !== 4" type="primary" link @click="toCreate(scope.row.orderId)">
          编辑
        </el-button>
        <el-button v-if="scope.row.status === 4" type="primary" link @click="toCreate(scope.row.orderId)"> 查看 </el-button>
        <el-button v-auth="'delete'" v-if="scope.row.status === 1" type="primary" link @click="toDelete(scope.row.orderId)">
          删除
        </el-button>
      </template>
    </ProTable>
  </div>
</template>

<style lang="scss" scoped></style>
